﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
    <title>梦响红木</title>
    <link href="https://at.alicdn.com/t/font_528879_ogzh9k2sqxnzsemi.css" rel="stylesheet" />
    <link href="css/public.css" rel="stylesheet" />
    <style>
        body{
              background: url(./Images/B01.jpg);
            background-size: 100%;
        }
        .content {
             width:100%;
            padding:0;
        }
            /*头部logo*/
            .content .logo_con {
                width: 100%;
                height: 35%;
                display: flex;
                align-items: center;
                justify-content: center;
                flex-direction: column;
            }

                .content .logo_con > img:nth-child(1) {
                    height: 62%;
                    display: block;
                }

                .content .logo_con > img:nth-child(2) {
                    height: 22%;
                }

            .content .record > p {
               display:flex;
               align-items:center;
            }
             .content .record > p > span:nth-child(1) {
                    flex:1;
                    text-align:right;
                }
                .content .record > p > span:nth-child(2) {
                  flex:2;
                  color:red;
                }


            /*中部产品*/
            .content .product_con {
                width: 100%;
                height: 35%;
                display: flex;
                align-items: center;
                justify-content: space-around;
                flex-direction: column;
            }

                .content .product_con > img:nth-child(1) {
                    width: 65%;
                    height: 55%;
                    display: block;
                    border-radius: 4px;
                    border: 1px solid white;
                }

                .content .product_con > a.img {
                    height: 20%;
                    display: block;
                }

                    .content .product_con > a.img > img {
                        height: 100%;
                        display: block;
                        width: 100%;
                    }


            /*底部按钮*/
            .content .footer_btn {
                width: 100%;
                height: 10%;
                position: absolute;
                bottom: 0;
                display: flex;
                background: #F0F0F0;
            }

                .content .footer_btn .btn_item {
                    flex: 1;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    color: #B3B3B3;
                    text-decoration: none;
                }

                    .content .footer_btn .btn_item > span:nth-child(1) {
                        font-size: 28px;
                    }

                    .content .footer_btn .btn_item > span:nth-child(2) {
                        font-size: 14px;
                    }

        .btn_item_active {
            background: #9D4338;
            color: white !important;
        }

        .add_con {
            width: 70% !important;
        }
    </style>
</head>
<body>
    <div class="content">
        <div class="logo_con">
            <img src="./Images/LOGO.png" />
            <img src="./Images/word.png" />
        </div>
        <div class="record">
            <p>
                <span>身份编码：</span>
                <span>454564353515313</span>
            </p>
            <p>
                <span>查询次数：</span>
                <span>1次</span>
            </p>
        </div>
        <div class="product_con">
            <img src="./Images/chanpin.png" />
            <a href="html/AccountBook.html" class="img">
                <img src="./Images/product_btn.png" />
            </a>
        </div>
        <div class="footer_btn">
            <a class="btn_item">
                <span data-index="1" class="iconfont icon-diqiu"></span>
                <span data-index="1">企业官网</span>
            </a>
            <a class="btn_item">
                <span class="iconfont icon-shipin1"></span>
                <span>企业视频</span>
            </a>
            <a href="html/College.html" class="btn_item">
                <span class="iconfont icon-peixunxueyuan"></span>
                <span>梦响商学院</span>
            </a>
            <a href="html/Service.html" class="btn_item">
                <span class="iconfont icon-weixingongzhonghao"></span>
                <span>微服务</span>
            </a>
        </div>

    </div>

</body>
</html>